@extends('home.layout.base')
<link rel="stylesheet" href="{{URL::asset('./css/help/list.css')}}">

@section('content')
<div class="main" id="helpList">
    <div class="storelistTitle" id="storelistTitle" v-cloak>
        <span class="storelistTitle_left">
            <span>

                <img src="{{URL::asset('./img/icon/home.png')}}">
            </span>
            <span><a href="{{route('home.index.index') }}">首页</a> > 帮助中心</span>
        </span>
        <span class="storelistTitle_right">
            <span>找不到合适的供应商？发个需求试试？</span>
            <button @click=" window.location.href = '{{ route('home.demand.demandAdd') }}'">免费发布需求</button>
        </span>
    </div>
    <div class="hrContent">
        @include('home.help.menu')
        <div class="hrContentRight" id="helpLists" v-cloak>
            <div class="myOrder">
                <div class="myTitle">
                    <div><span></span>@{{label}}</div>
                </div>
            </div>
            <div class="listData">
                <div class="listData_data" v-for="(item,index) in listData" @click="getDetails(item.id)">
                    <div class="listData_title">@{{item.title}}</div>
                    <div class="listData_time">@{{item.start_at}}</div>
                </div>
                <div class="elementPage" style="margin-top: 20px;">
                    <el-pagination :pager-count="5" @current-change="handleCurrentChange" :current-page.sync="pageNumber" background prev-text="上一页" next-text="下一页" layout="prev, pager, next,jumper" :total="pageCount">
                    </el-pagination>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('compontentScipts')
<script>
    $(() => {
        let helpLists = new Vue({
            el: '#helpLists',
            data: () => {
                return {
                    typeId: getQueryString("typeId") || '',
                    label: getQueryString("label") || '栏目分类',
                    pageNumber: 1,
                    pageCount: 0,
                    listData:[],
                }
            },
            created() {
                this.getList();
            },
            mounted() {},
            methods: {
                getList() {
                    let data = {
                        page:this.pageNumber,
                        cate_pid:this.typeId
                    }
                    apiAjax("{{ route('home.help.helpListApi')}}", 'get', data, (res) => {
                        if (res.code == 0) {
                            this.listData=res.data.data;
                            this.pageCount=res.data.total;
                        } else {
                            this.$message({
                                message: res.msg,
                                type: 'warning'
                            });

                        }
                    }, (erro) => {

                    });
                },
                getDetails(id){
                    window.location.href = "{{ route('home.help.helpDetails') }}?id=" + id;

                },
                handleCurrentChange(val) {
                    this.pageNumber = val;
                    this.getList()
                },
            }
        })
    })
</script>
@endsection